<%layout("/common/layout.html"){%>

<div class="main-bg container">

    <%if(session.user.id==user.id){%>
    <a href="${ctxPath}/user/myInfo" title="设置" class="btn btn-warning if-set">
        <span class="glyphicon glyphicon-pencil" style="color: black"></span> 更改信息
    </a>
    <%}%>

    <div class="profile">
        <img src="${user.img}" class="img-circle" alt="" width="150" height="150">
        <p class="if-name">${user.name}</p>
        <!-- <div class="name">果果</div> -->
    </div>
    <!-- <div class="net-name ">
        <span class="net-name">${user.name}</span>
    </div> -->
    <div class="row text-center">
        <div class="signature">${user.feeling}</div>
    </div>

</div>

<main>
    <div class="container person-setup" role="tabpanel">

        <%if(session.user.id==user.id){%>

        <div class="col-md-8 col-md-offset-1">
            <div class="container">
                <ul class="nav nav-pills classify" role="tablist" id="myTab">
                    <li role="presentation" class="active"><a href="#zan" role="tab" data-toggle="tab">我收藏的</a></li>
                    <li role="presentation"><a href="#designed" role="tab" data-toggle="tab">我的设计</a></li>
                    <li role="presentation"><a href="#bought" role="tab" data-toggle="tab">我购买的</a></li>
                    <li role="presentation"><a href="#resource" role="tab" data-toggle="tab">我的素材</a></li>
                </ul>
            </div>
        </div>


        <div class="tab-content">

            <div role="tabpanel" class="tab-pane active container-fluid" id="zan">
                <div class="fall-layout row">
                    <div class="col-md-10 col-md-offset-1 text-center">

                        <%for(design0 in collects){%>

                        <div class="col-md-3">
                            <a href="${ctxPath}/design?design=${design0.design.id}" class="thumbnail">
                                <img src="${design0.design.img}" alt="...">
                            </a>
                        </div>

                        <%}%>


                    </div>
                </div>
            </div>

            <div role="tabpanel" class="tab-pane container-fluid" id="designed">
                <div class="fall-layout row">
                    <div class="col-md-10 col-md-offset-1 text-center">

                        <%for(design1 in designs){%>

                        <div class="col-md-3">
                            <a href="${ctxPath}/design?design=${design1.id}" class="thumbnail">
                                <img src="${design1.img}" alt="...">
                            </a>
                        </div>

                        <%}%>

                    </div>
                </div>
            </div>
            <div role="tabpanel" class="tab-pane container-fluid" id="bought">
                <div class="fall-layout row">
                    <div class="col-md-10 col-md-offset-1 text-center">

                        <%for(order in orders){%>

                        <div class="col-md-3">
                            <a href="${ctxPath}/design/info?design=${order.design.id}" class="thumbnail">
                                <img src="${order.design.img}" alt="...">
                            </a>
                        </div>

                        <%}%>

                    </div>
                </div>
            </div>
            <div role="tabpanel" class="tab-pane container-fluid" id="resource">
                <div class="fall-layout row">
                    <div class="col-md-10 col-md-offset-1 text-center">

                        <%for(image in images){%>
                        <div class="col-md-3">
                            <a href="#" class="thumbnail">
                                <img src="${image.img}" alt="...">
                            </a>
                        </div>
                        <%}%>

                    </div>
                </div>
            </div>
        </div>
        <%}else{%>

        <div class="col-md-10 col-md-offset-1 text-center">

            <%for(design1 in designs){%>

            <div class="col-md-3">
                <a href="${ctxPath}/design?design=${design1.id}" class="thumbnail">
                    <img src="${design1.img}" alt="...">
                </a>
            </div>

            <%}%>

        </div>

        <%}%>
    </div>
</main>

<%include("/common/footer.html"){}%>

<script type="text/javascript" src="${ctxPath}/js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="${ctxPath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${ctxPath}/js/nav.js"></script>
<script type="text/javascript" src="${ctxPath}/js/tog.js"></script>

<script type="text/javascript">
    $('#myTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    })
</script>

<%}%>